<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<!-- CSS
    ================================================== -->
<link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/main.css">

<!-- favicons
================================================== -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<body>
<div th:replace="common/top">

</div>
<div>
   <div id="Content">
       <section class="back-img" id="home" data-parallax="scroll" data-image-src="../images/background.png" data-natural-width=3000 data-natural-height=2000>

           <div class="overlay"></div>
           <div class="home-content">

               <div class="row contents">
                   <!-- <div class="home-image-left">
                    </div>-->
<!--                   <img class="one" src="../images/ggggg.png" width="600"height="200"align="left" style="border:10px ridge #909090" >-->
                   <br>
                   <br>
                   <img class="one" src="../images/background.png" width="900"height="300" align="right"  >


                   <br>
                   <div class="home-content-right">
                  <h3 data-aos="fade-up">Welcome to MyPetstore</h3>

                       <h2 data-aos="fade-up" th:each="Category:${categoryList}">
                           <a th:href="@{'/catalog/viewCategory'(categoryId=${Category.categoryId})}" class="categoryName" title="这是鱼" >
                               <h3 th:text="${Category.categoryId}"></h3>
                           </a>
                       </h2>

                   </div>

               </div>

           </div> <!-- end home-content -->
           <div class="home-scrolldown" >
           <a href="../index.html" class="scroll-icon smoothscroll">
               <span>------------------------Here Return to guide </span>
           </a>
           </div>

    </section> <!-- end home -->
   </div>
</div>
<div th:replace="common/bottom">

</div>
</body>
</html>